<template>
	<view class="u-p-b-40">
		<u-navbar title-color="#333" title-bold title-size="36" title="我的佣金" :border-bottom="false"
			:background="{backgroundColor: '#FEF1E2'}"></u-navbar>
		<view class="top-div">
			<image class="jifen-img" src="../../static/img/mine/yongjinimg.png" mode=""></image>
			<view class="jf-div">
				<view class="font_12_333">
					我的佣金
				</view>
				<view class="jf-num u-m-t-10">
					{{money}}
				</view>
				<view class="t-btn" @click="tixian">
					立即提现
				</view>
			</view>
		</view>
		
		<view class="to120">
			<view class="li-item" v-for="(item,index) in list" :key="index">
				<view class="font_weight u-p-b-24 border_bottom_eee">
					<span class="font_12_333 ">订单号：</span>
					<span class="font_12_999 ">1124-128483745984546464</span>
				</view>
				<view class="flex flex_sb u-p-t-32">
					<view class="flex">
						<!-- <image class="headimg" src="../../static/img/renwu.png" mode="aspectFill"></image> -->
						<view class="u-m-l-24">
							<view class="flex">
								<view class="font_weight">
									133****8985
								</view>
								<view class="u-m-l-24 bq bq1" v-if="index==0">
									黄金
								</view>
								<view class="u-m-l-24 bq bq2" v-if="index==1">
									白金
								</view>
								<view class="u-m-l-24 bq bq3" v-if="index==2">
									荣耀
								</view>
								<view class="u-m-l-24 bq bq4" v-if="index==3">
									王者
								</view>
							</view>
							
							<view class="font_12_999 u-m-t-18">
								2023-07-12 15：11
							</view>
						</view>
					</view>
					
					<view class="num1">
						<span class="u-font-24">￥</span>
						15.00
					</view>
				</view>
				
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				current: 0,
				type:1,
				userInfo:[],
				money:'',
				
				
				total:0,
				pageNum:1,
				pageSize:10,
			}
		},
		onReachBottom() {
			if (this.pageNum * this.pageSize > this.total) {
				// uni.hideNavigationBarLoading();
			} else {
				this.pageNum++;
				this.dataList()
			}
		},
		onLoad(e) {
			this.type = e.type
			this.getInfo()
			this.dataList()
		},
		onShow() {
			
		},
		methods: {
			//个人信息
			getInfo() {
				let url = ""
				if(this.type==1){
					url='/getUserInfo'
				}else{
					url='/lawyer/getLawyer'
				}
				this.$api({
					url: url,
					method: 'get',
					data: {
						token:uni.getStorageSync("token")
					},
				}).then(res => {
					if (res.code == 1) {
						this.money = res.data.money
					} 
				})
				
				
			},
			dataList(){
				this.$api({
					url: '/getUserYongJin',
					method: 'get',
					data: {
						token:uni.getStorageSync("token"),
						page:this.pageNum,
						limit:this.pageSize,
						type:2 //0全部 1支出 2 收入
					},
				}).then(res => {
					if (res.code == 1) {
						this.total=res.data.count
						let data = res.data.list
						if (this.pageNum == 1) {
							this.list = data
						} else {
							this.list = [...this.list, ...data]
						}
					}
				})
			},
			
			tixian(){
				uni.navigateTo({
					url:"/pages/mine/withdrawal?type="+this.type
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	.to120{
		margin-top: -120rpx;
		position: relative;
		z-index: 10;
	}
	.li-item{
		width: 686rpx;
		padding: 28rpx 24rpx;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		margin: 18rpx auto;
		
		.headimg{
			width: 90rpx;
			height: 90rpx;
			border-radius: 50%;
		}
		
		.bq{
			width: 80rpx;
			height: 36rpx;
			border-radius: 40rpx 40rpx 40rpx 40rpx;
			font-weight: bold;
			font-size: 20rpx;
			color: #34302D;
			line-height: 36rpx;
			text-align: center;
		}
		.bq1{
			background: linear-gradient( 180deg, #FFEDBE 0%, #FCE4A5 100%);
		}
		.bq2{
			background: linear-gradient( 180deg, #FCEFDF 0%, #F5DBC4 100%);
		}
		.bq3{
			background: linear-gradient( 180deg, #C4E9FF 0%, #DBF2FF 13%, #E4E9FF 43%, #ECE4FF 83%, #BEE7FF 100%);
		}
		.bq4{
			background: linear-gradient( 180deg, #555555 0%, #333333 100%);
			color: #F4E1C3;
		}
		.num1{
			font-weight: bold;
			font-size: 36rpx;
			color: #FC3A30;
		}
		.num2{
			font-weight: bold;
			font-size: 36rpx;
			color: #307EFC;
		}
	}
	.top-div {
		width: 750rpx;
		height: 330rpx;

		background: linear-gradient(180deg, #FEF1E2 0%, #FFF1E1 59%, rgba(254, 241, 226, 0) 100%);
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		position: relative;

		.jifen-img {
			width: 266rpx;
			height: 204rpx;
			position: absolute;
			right: 52rpx;
			top: 0;
		}

		.jf-div {
			padding: 18rpx 52rpx;
			padding-top: 52rpx;
		}

		.jf-num {
			font-weight: bold;
			font-size: 56rpx;
			color: #333333;
		}

		.t-btn {
			width: 144rpx;
			height: 48rpx;
			background: #502C05;
			border-radius: 42rpx 42rpx 42rpx 42rpx;
			font-size: 24rpx;
			color: #FFF1D3;
			text-align: center;
			line-height: 48rpx;
		}
	}

	.jfhl {
		width: 686rpx;
		margin: 0 auto;
		margin-top: -120rpx;
		background: #FFFFFF;
		border-radius: 44rpx;
		padding: 0 34rpx;
		position: relative;
		z-index: 2;
		
	}
</style>